<template>
  <div>
    <div style="border-bottom: 1px solid #e5e5e5; margin-bottom: 5px; font-size: 14px;">
      <span style="margin: 0 14px; color: #aaaaaa;">{{ row.time }}</span>
      <span style="color: #3c3c3c">
        <span style="color: #aaaaaa; margin-right: 10px;">订单号: </span> {{ row.orderDetailId }}
      </span>
    </div>
    <div style="display: flex; justify-content: space-between;">
      <div style="display: flex;">
        <el-image
          style="width: 80px; height: 100px; margin: 0 14px;"
          :src="row.image"
        ></el-image>
        <span class="content">
          {{ row.commodityName.length > 40 ? row.commodityName.slice(0, 40) : row.commodityName }}
        </span>
      </div>
      <span> x {{ row.number }}</span>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    row: Object,
  },
};
</script>

<style scoped>
.content {
  width: 150px;
  font-size: 13px;
  margin-right: 20px;
}
</style>